<div class="pm_modal {{ctrl.class}} domains" role="dialog" style="display: block;">
    <form method="post" class="modal-dialog" ng-submit="ctrl.submit()">
        <button type="button" ng-click="ctrl.cancel()" aria-hidden="true" title-translate="Close" title-translate-context="Action" class="fa fa-times close"></button>
        <div class="modal-content">
            <div class="modal-header">
                <domains-menu-step></domains-menu-step>
                <span
                    ng-show="ctrl.domain.DomainName"
                    class="pull-right pm_badge success"
                    translate-context="Add a new domain label"
                    translate>Set</span>
                <h4 class="modal-title">1. <span translate translate-context="Title">Domain</span></h4>
            </div>
            <div class="modal-body pm_form">
                <p><span translate-comment="label for adding a new custom domain" translate translate-context="Info">Add a domain that you own to your ProtonMail account.</span> <a target="_blank" href="https://protonmail.com/support/knowledge-base/custom-domains/" translate translate-context="Action">Learn more</a></p>

                <input
                    ng-hide="ctrl.domain"
                    type="text"
                    autofocus
                    ng-model="ctrl.name"
                    placeholder-translate-context="Add a domain"
                    placeholder-translate="Domain name">
                <p class="alert alert-warning" ng-show="ctrl.beginsWith('www.')" translate-context="domains" translate>'www' subdomains are typically not used for email. Are you sure you want to use this domain value?</p>
                <textarea rows="1" ng-show="ctrl.domain" readonly ng-bind="::ctrl.domain.DomainName"></textarea>
            </div>
        </div>
        <div class="modal-footer clearfix">
            <button type="button" class="pm_button modal-footer-button disabled-if-network-activity" ng-click="ctrl.cancel()" translate translate-context="Action">Close</button>
            <button type="submit" class="pm_button primary modal-footer-button disabled-if-network-activity" ng-hide="ctrl.domain.DomainName" translate translate-context="Action">Next</button>
            <button type="button" class="pm_button primary modal-footer-button" ng-show="ctrl.domain.DomainName" ng-click="ctrl.next()" translate translate-context="Action">Next</button>
        </div>
    </form>
    <div class="modal-overlay"></div>
</div>
